<template>
  <div>
    <template v-for="menu in userMenu">
      <el-sub-menu
        :index="menu.path"
        :key="menu._id"
        v-if="
          menu.children &&
          menu.children.length > 0 &&
          menu.children[0].menuType == 1
        "
      >
        <template #title>
          <el-icon>
            <component :is="menu.icon" />
          </el-icon>
          <span>{{ menu.menuName }}</span>
        </template>
        <tree-menu :userMenu="menu.children" />
      </el-sub-menu>
      <el-menu-item
        v-else-if="menu.menuType == 1"
        :index="menu.path"
        :key="menu._id"
        >{{ menu.menuName }}</el-menu-item
      >
    </template>
  </div>
</template>

<script setup>
import { defineProps } from 'vue'
let props = defineProps({
  userMenu: {
    type: Array
  }
})
console.log(props.userMenu);
</script>

<style lang="scss" scoped>
</style>